export const palette = {
  // TODO: orange

  white: {
    $0: '#FFF',
    $5: 'rgba(255,255,255,0.96)',
    $10: 'rgba(255,255,255,0.88)',
    $20: 'rgba(255,255,255,0.78)',
    $30: 'rgba(255,255,255,0.66)',
    $40: 'rgba(255,255,255,0.55)',
    $50: 'rgba(255,255,255,0.43)',
    $60: 'rgba(255,255,255,0.32)',
    $70: 'rgba(255,255,255,0.22)',
    $80: 'rgba(255,255,255,0.16)',
    $90: 'rgba(255,255,255,0.09)',
    $100: 'transparent',
  },

  black: {
    $0: 'transparent',
    $5: 'rgba(0,0,0,0.06)',
    $10: 'rgba(0,0,0,0.12)',
    $20: 'rgba(0,0,0,0.22)',
    $30: 'rgba(0,0,0,0.34)',
    $40: 'rgba(0,0,0,0.45)',
    $50: 'rgba(0,0,0,0.56)',
    $60: 'rgba(0,0,0,0.68)',
    $70: 'rgba(0,0,0,0.78)',
    $80: 'rgba(0,0,0,0.84)',
    $90: 'rgba(0,0,0,0.92)',
    $100: '#000',
  },

  greyWarm: {
    $0: '#FFFFFF',
    $5: '#F4F4F4',
    $10: '#E0E0E0',
    $20: '#C6C6C6',
    $30: '#A8A8A8',
    $40: '#8D8D8D',
    $50: '#6F6F6F',
    $60: '#525252',
    $70: '#393939',
    $80: '#282828',
    $90: '#161616',
    $100: '#000000',
  },

  greyCold: {
    $0: '#FFFFFF',
    $5: '#EFF0F1',
    $10: '#DFE2E4',
    $20: '#BFC5CA',
    $30: '#A0A8B0',
    $40: '#808B95',
    $50: '#616E7C',
    $60: '#4D5862',
    $70: '#3A424A',
    $80: '#262C31',
    $90: '#131618',
    $100: '#000000',
  },

  blue: {
    $0: '#FFFFFF',
    $5: '#E6F7FF',
    $10: '#CDEEFF',
    $20: '#A0D7F3',
    $30: '#6EBDE6',
    $40: '#37A2DB',
    $50: '#0087CD',
    $60: '#006CA4',
    $70: '#00517B',
    $80: '#003653',
    $90: '#001B29',
    $100: '#000000',
  },

  yellow: {
    $0: '#FFFFFF',
    $5: '#FFFFE5',
    $10: '#FFFFC8',
    $20: '#FFFF93',
    $30: '#FFFA4D',
    $40: '#FAED00',
    $50: '#C2B800',
    $60: '#888100',
    $70: '#555100',
    $80: '#2E2C00',
    $90: '#121100',
    $100: '#000000',
  },

  red: {
    $0: '#FFFFFF',
    $5: '#FFF1F1',
    $10: '#FFE0E1',
    $20: '#FFBFBF',
    $30: '#FF9292',
    $40: '#F95E5F',
    $50: '#DC2C2C',
    $60: '#9C2323',
    $70: '#641C1B',
    $80: '#381314',
    $90: '#170A0A',
    $100: '#000000',
  },

  purple: {
    $0: '#FFFFFF',
    $5: '#F7F2FF',
    $10: '#EADCFF',
    $20: '#D5BBFF',
    $30: '#BE95FF',
    $40: '#A973FF',
    $50: '#914CFF',
    $60: '#6534B2',
    $70: '#482580',
    $80: '#301854',
    $90: '#1B0E31',
    $100: '#000000',
  },

  lightBlue: {
    $0: '#FFFFFF',
    $5: '#E6F7FF',
    $10: '#CDEEFF',
    $20: '#A0D7F3',
    $30: '#6EBDE6',
    $40: '#37A2DB',
    $50: '#0087CD',
    $60: '#006CA4',
    $70: '#00517B',
    $80: '#003653',
    $90: '#001B29',
    $100: '#000000',
  },

  green: {
    $0: '#FFFFFF',
    $5: '#D7FAD2',
    $10: '#B3F5A7',
    $20: '#87E376',
    $30: '#5DD148',
    $40: '#35BF23',
    $50: '#0CAD00',
    $60: '#178A1E',
    $70: '#236831',
    $80: '#24452E',
    $90: '#19231E',
    $100: '#000000',
  },
}

export interface Color {
  $0: string
  $5: string
  $10: string
  $20: string
  $30: string
  $40: string
  $50: string
  $60: string
  $70: string
  $80: string
  $90: string
  $100: string
}

export type PaletteTypes = typeof palette
export type Palette = { [K in keyof PaletteTypes]: Color }
